<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
  	<meta charset="UTF-8">
  	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
  	<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  	<title>省钱教程win</title>
  	<link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
  	<link rel="stylesheet" type="text/css" href="../../css/common.css">
    <style>
        /*tab分类*/
        .aui-tab{border-bottom: 1px solid #ededed}
        .aui-tab .aui-tab-item{height: 1.2rem;line-height: 1.2rem;font-size:0.426rem;color:#333;}
        .aui-tab-item.aui-active{color: #ff4c41;border: none;}
        .aui-active::after{content: "";display: block;margin:-3px auto 0 auto;width:2rem;height: 2px;
          background: #ff4c41;box-sizing: border-box;}
    </style>
</head>
<body id="wrap">
    <header class="aui-bar aui-bar-nav aui-bar-light sg-color-font1 sg-color-bg1" id="aui-header">
        <a class="aui-pull-left"  tapmode onclick="closeWinFun()">
            <span class="aui-iconfont aui-icon-left sg-text-size36 sg-color-font1"></span>
        </a>
        <div class="aui-title sg-text-size36">省钱教程</div>
    </header>
    <div class="contentArea">
        <div class="aui-tab" id="tab">
            <div class="aui-tab-item aui-active">淘宝天猫</div>
            <div class="aui-tab-item">拼多多</div>
            <div class="aui-tab-item">京东</div>
        </div>
    </div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/aui-tab.js"></script>
<script type="text/javascript">
(function (doc, win) {
  	var docEl = doc.documentElement,
  	resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
  	recalc = function () {
    		var clientWidth = docEl.clientWidth;
    		if (!clientWidth) return;
    		docEl.style.setProperty('font-size',(clientWidth / 10) + 'px','important');
  	};
  	if(!doc.addEventListener){
        return
    };
  	win.addEventListener(resizeEvt, recalc, false);
  	doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
var tab = new auiTab({
     element:document.getElementById("tab"),
     index:1,
     repeatClick:false
 },function(ret){
     setFrameShow(ret.index - 1);
 });
apiready = function () {
		//解析元素 tapmode 属性，优化点击事件处理 - 第四步
		api.parseTapmode();
    var header = $api.byId('aui-header');
		$api.fixStatusBar(header);
    // 打开当前对应frm页面
    openFrameFun();
}
// 切换平台
function setFrameShow(index){
    api.sendEvent({
        name: 'courseChange',
        extra: {
            key: index
        }
    });
}
//打开当前商品对应的frm页面
function openFrameFun(){
    api.openFrame({
        name: 'course',
        url: './course_frm.html',
        rect: {
            x: 0,
            y: $api.dom('#aui-header').offsetHeight + $api.dom('.contentArea').offsetHeight,
    				w: 'auto',
    				h: 'auto'
        },
        bounces: false,
        bgColor: 'rgba(0,0,0,0)',
    });
}
// 关闭当前页面
function closeWinFun(){
    api.closeWin({});
}
</script>
</html>
